import React                from 'react';
import {connect}            from "react-redux";

import Empty                from '../../components/form/Empty';
import PullUp               from '../../components/form/PullUp';
import Pagination           from '../../components/Pagination';
import {loadAccumList}      from "../../actions/store";
import './accumulateList.scss';

class AccumulateList extends Pagination {

    _method = () => 'loadAccumList';

    _setTitle = () => document.title = '积分兑换记录';

    render(){
        var {list} = this.state;
        return (
            <div className="accum-list">
                <Empty list={list} type="accum">
                    <PullUp load={this.reload.bind(this)}>
                        {list.map(m =>
                            <div key={m.id} className="r-item flex-avg">
                                <div className="ri-left">
                                    <div>{m.title}</div>
                                    <div>{m.time}</div>
                                </div>
                                <div className={`ri-right flex-avg${0 < m.accumulate ? ' active' : ''}`}>{m.accumulate}</div>
                            </div>
                        )}
                    </PullUp>
                </Empty>
            </div>
        );
    }

}

export default connect(undefined, {loadAccumList})(AccumulateList);
